<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>商品列表</title>
</head>
<style>
    div{
        width: 600px;
        margin: 10px auto;
        padding: 2px;
        border: #ccc solid 1px;
        overflow: hidden;
    }
    dl{
        float: left;
        border: #ccc solid 1px;
        width: 190px;
        margin-top: -5px;
        margin-right: 11px;
    }
    dd{
        margin-left: 5px;
        font-size: 8px;
    }
    .name{
        color: blue;
        font-size: 13px;
    }
    #san{
        margin-right: 0;
    }
    .tu2{
        position: relative;
    }
    .jiaobiao{
        position: absolute;
        top: 0;
        right: 0;

    }
   

</style>
<body>
    <div>
        <h2>商品列表</h2>
        
        <dl><dt><img src="image/photo_01.jpg" alt=""></dt>
        <dd  class="name">韩版修身长袖T恤打底衫</dd>
        <dd>一口价：49.00</dd></dl>
        <dl>
            <dt class="tu2"><img src="image/photo_02.jpg" alt="" >
                <img src="image/xsq.png" alt="" class="jiaobiao"></dt>
        <dd class="name">2011新款T恤短袖</dd>
        <dd>一口价：39.00</dd>
        </dl>
        <dl id="san">
            <dt><img src="image/photo_03.jpg" alt=""></dt>
        <dd class="name">钉珠蝴蝶结秋冬背心呢料裙</dd>
        <dd>一口价：68.00</dd>
        </dl>
        <dl>
            <dt><img src="image/photo_04.jpg" alt=""></dt>
        <dd class="name">长袖连衣裙</dd>
        <dd>一口价：79.00</dd>
        </dl>
    </div>
</body>
</html>